<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>小米注册页面</title>
	<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <style type="text/css">
		*{
			margin:0;
			padding:0;
		}
		body{
			width:100%;
			height:100%;
			background-color:#f9f9f9;
		}
		main{
			width:856px;
			height:502px;
			background-color:#fff;
			margin:175px auto 188px;
		}
		.logo{
			height: 49px;
			text-align: center;
			margin-bottom:38px;
		}
		.title{
			text-align: center;
			font-size: 32px;
			color:#333333;
		}
		.register{
			width:332px;
			height:42px;
			margin:38px auto 64px;
		}
		select{
			width:332px;
			height:42px;
			border:none;
			font-size: 12px;
			color:#555555;
			border:1px solid #e8e8e8;
			padding:12px;
			margin-bottom:15px;
		}
		input[type="phone"]{
			width:332px;
			font-size: 12px;
			color:#969696;
			border:none;
			border:1px solid #e8e8e8;
			box-sizing: border-box;
			margin:auto;
			padding: 12px;
			margin-bottom:15px;
		}
		input[type="text"]{
			width:192px;
			font-size: 12px;
			color:#969696;
			border:none;
			border:1px solid #e8e8e8;
			box-sizing: border-box;
			margin:auto;
			padding: 12px;
			margin-bottom:30px;
			float: left;
		}
		.vfcode{
			float: right;
		}
		input[type=button] {
        	width: 332px;
        	height: 50px;
        	line-height: 50px;
        	font-size: 14px;
        	text-align: center;
        	color: #fff;
        	border: none;
        	margin-bottom: 12px;
        	background-color: #ef5b00;
    	}
    	.register span{
    		font-size: 12px;
    		color:#9d9d9d;
    	}
    	.special-span{
    		font-size: 12px;
    		color:#333333;
    	}
    	footer {
	        width: 100%;
	        /*position: fixed;*/
	        margin: 0 auto;
	        bottom:0px;
    	}
    
    	.footer-top {
	        width: 232px;
	        margin: 0 auto;
	        margin-bottom: 20px;
	        position: relative;
    	}
    
	    .footer-top span {
	        display: inline-block;
	        margin: 0 10px;
	        font-size: 12px;
	        color: #757575;
	        text-align: center;
	    }
    
	    .footer-top span:nth-of-type(1) {
	        color: #333333;
	    }
	    
	    .interval {
	        width: 1px;
	        height: 12px;
	        position: absolute;
	        background-color: #757575;
	    }
    
	    .interval:nth-of-type(1) {
	        position: absolute;
	        top: 5px;
	        left: 46px;
	    }
    
	    .interval:nth-of-type(2) {
	        position: absolute;
	        top: 5px;
	        left: 94px;
	    }
    
	    .interval:nth-of-type(3) {
	        position: absolute;
	        top: 5px;
	        left: 161px;
	    }
    
	    .footer-bottom {
	        width: 100%;
	        margin-bottom: 30px;
	        text-align: center;
	        font-size: 12px;
	        color: #757575;
	    }
    </style>
</head>
<body>
	<main>
		<div class="logo">
            <img src="./images/小米logo.png">
        </div>
        <div class="title">
        	注册小米账号
        </div>
        <div class="register">
        	<select>
        		<option value="中国">中国+86</option>
        		<option value="">中国台湾+886</option>
        		<option value="">中国香港+852</option>
        		<option value="">Brazil+55</option>
        		<option value="">India+91</option>
        	</select>
        	<input type="phone" placeholder="请输入手机号码">
        	<input type="text" placeholder="图片验证码"><img class="vfcode" src="./images/验证码.png">
        	<input type="button" value="立即注册">
        	<span>点击“立即注册”，即表示您同意并愿意遵守小米 <span style="color:#333333;font-weight: bold">用户协议</span> 和 <span style="color:#333333;font-weight: bold">隐私政策</span></span>
        </div>
   	</main>
   	    <footer>
        <div class="footer-top">
            <span>简体</span>
            <div class="interval"></div>
            <span>繁体</span>
            <div class="interval"></div>
            <span>English</span>
            <div class="interval"></div>
            <span>常见问题</span>
        </div>
        <div class="footer-bottom">
            小米公司版权所有-京ICP备10046444-<img src="./images/ghs.png" alt="">京公网安备11010802020134号-京ICP证110507号
        </div>
    </footer>
</body>
</html>